<template>
    <div style="overflow: hidden;background-color: #fff;height: 100vh;width: 100vw;" v-loading="loading">
        <div class="video_title">
            <van-icon name="arrow-left" class="icon" @click="goBack" />
            <p>评价</p>
        </div>
        <van-tabs v-model="activeKey">
            <van-tab title="教师教学质量评估" :name="1">
                <div style="height: 180px;">
                    <van-field v-model="value" label="教师" placeholder="请选择评价教师" readonly @click-input="show=true"/>
                    <van-popup v-model="show" round position="bottom">
                        <van-picker
                            title="请选择评价教师"
                            show-toolbar
                            :columns="columns"
                            @confirm="onConfirm"
                            @cancel="show = false"
                        />
                    </van-popup>
                    <div style="display: flex;align-items: center;padding: 15px">
                        <p>所教范围</p>
                        <div style="flex: 1;margin-left: 18px;">
                            {{round_str.length!=0&&round_str.filter(item=>item.title==value).length!=0 ?round_str.filter(item=>item.title==value)[0].str:''}}
                        </div>
                    </div>
                </div>
                <div v-show="value">
                    <div class="item" style="background-color: #ddd;"> 
                        <p>
                            类目
                        </p>
                        <div>得分</div>
                    </div>
                    <div style="height: calc(100vh - 43.5px - 44px - 180px - 60px - 44px);overflow-y: auto;overflow-x: hidden;">
                        <div class="item border" v-for="item,index in list" :key="index">
                            <p>{{ item.lebel }}（{{item.score}}分）</p>
                            <div>
                                <van-stepper v-model="form[item.filed]" step="1"  min="1" :max="item.score"/>
                            </div>
                        </div>
                        <div class="item border">
                            <p>总分（{{list.reduce((total, item)=>total + Number(item.score),0)}}分）</p>
                            <div>
                                {{ score_all }}分
                            </div>
                        </div>
                    </div>
                    <div style="padding: 15px;">
                        <van-button type="primary" block size="small" @click="commit">提交</van-button>
                    </div>
                </div>
            </van-tab>
            <van-tab title="培训课程设计评价" :name="2">
                <div style="height: calc(100vh - 43.5px - 44px - 60px - 51px);overflow-y: auto;overflow-x: hidden;">
                    <div v-for="(item,index) in list" :key="item.id">
                        <div style="display: flex;align-items: center;padding: 15px;font-weight: 600;font-size: 18px;">
                            <p>{{index+1}}、{{ item.lebel }}</p>
                        </div>
                        <div class="item" style="background-color: #ddd;"> 
                            <p>
                                内容
                            </p>
                            <div>得分</div>
                        </div>
                        <div class="item border" v-for="el in item.option" :key="el.id">
                            <p>{{el.lebel}}（{{el.score}}分）</p>
                            <div>
                                <van-stepper v-model="form[el.filed]" step="1"  min="1" :max="el.score"/>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="item" style="font-weight: 600;font-size: 18px;"> 
                    <p>
                        总分
                    </p>
                    <div>{{ score_all }}分</div>
                </div>
                <div style="padding: 15px;">
                    <van-button type="primary" block size="small" @click="commitA">提交</van-button>
                </div>
            </van-tab>
        </van-tabs>
    </div>
  </template>
<script>
import exports from '@/components/exports.vue';
import { downImg } from "@/utils/downloadImg.js";
import { download } from "@/api/download.js";
import { evaluationTeacherLog,evaluationLog,evaluationTeacherList,evaluationLogList} from "@/api/admin.js";
import {
  getGZ,getsubjectTitle,getapplyid
} from "@/utils/auth.js";
export default {
    components:{exports},
    data () {
        return {
            loading:false,
            activeKey:1,
            value:'',
            columns:[],
            show:false,
            round_str:[],//教学范围
            list:[],
            userInfo:{},
            TCshow:false,
            TCshowImg:false,
            downloadURL:'',
            form:{},
            score_all:0,
            http:process.env.NODE_ENV === 'development' ? process.env.VUE_APP_BASE_API : window.location.href.slice(0, window.location.href.indexOf('/user')),
            yes_teacher:true,
        }
    },
    watch: {
        form:{
            deep:true,
            handler(value){
                this.score_all=0
                if(this.activeKey==1){
                    this.list.map(item=>{
                        this.score_all +=value[item.filed]
                    })
                }else{
                    let arr = [].concat.apply([], JSON.parse(JSON.stringify(this.list)).map(item=>item.option))
                    arr.map(item=>{
                        this.score_all +=value[item.filed]
                    })
                }
            }
        },
        activeKey(val){
            this.changeActive()
        }
    },
    created () {
        // huacong
        this.changeActive()
        // this.userInfo=JSON.parse(this.$route.query.list)
    },
    methods: {
        goBack(){
            this.$router.go(-1)
        },
        onConfirm(value, index){
            this.value=value
            this.show=false
        },
        changeActive(){
            if(this.http.includes('qiye')||this.http.includes('huacong')){
                if(this.activeKey==1){
                    this.columns=['唐烽','祁振霆']
                    if(getsubjectTitle().includes('初培')){
                        this.round_str = [
                            {
                                title:'唐烽',
                                str:'安全生产形势、安全生产方针、政策及其发展流程，法律法规体系及其基础知识，主要法律法规规程及其规范性文件，安全生产责任制、规章制度，现场安全管理与安全标准知识，现代安全管理论及实践，风险管理'
                            },
                            {
                                title:'祁振霆',
                                str:'事故致因理论与事故预防原理，事故应急及应急救援预案，事故报告、调查与处理，职业健康安全管理体系与企业安全文化，劳动保护、职业健康及事故案例，安全生产技术的分类、意义及要求，相关安全生产技术知识'
                            },
                        ]
                    }else{
                        this.round_str = [
                            {
                                title:'唐烽',
                                str:'有关安全生产的新法律、法规及规范性文件等，有关安全生产的新技术、新工艺、新材料、新设备及其安全技术要求'
                            },
                            {
                                title:'祁振霆',
                                str:'典型事故案例分析，国内外有关安全生产管理的先进经验'
                            },
                        ]
                    }
                    this.list = [
                        {
                            id:1,
                            lebel:'授课思路清晰，课堂掌控组织能力好，理论联系实际',
                            score:25,
                            filed:'a',
                        },
                        {
                            id:2,
                            lebel:'讲课富有激情，营造课堂气氛。语言表达有条理性',
                            score:25,
                            filed:'b',
                        },
                        {
                            id:3,
                            lebel:'备课充分，教学内容设计系统全面，课件制作精美',
                            score:25,
                            filed:'c',
                        },
                        {
                            id:4,
                            lebel:'开展教学互动，善于启发引导，调动学员学习积极性',
                            score:25,
                            filed:'d',
                        },
                    ]
                    this.$nextTick(()=>{
                        this.list.map(item=>{
                            this.form[item.filed] = item.score
                        })
                        this.$forceUpdate()
                    })
                }else{
                    this.list = [
                        {
                            id:10010,
                            lebel:'课程目标',
                            option:[
                                {
                                    id:1,
                                    lebel:'课程培训目标清晰度、完整度。',
                                    score:10,
                                    filed:'a',
                                },
                                {
                                    id:2,
                                    lebel:'课程培训目标与培训需求的契合度。',
                                    score:10,
                                    filed:'b',
                                },
                            ],
                        },
                        {
                            id:10012,
                            lebel:'课程内容',
                            option:[
                                {
                                    id:3,
                                    lebel:'课程内容设计与参训者岗位职责及知识背景的符合度。',
                                    score:10,
                                    filed:'c',
                                },
                                {
                                    id:4,
                                    lebel:'课程内容的深度、广度和容量对培训目标的达成度。',
                                    score:10,
                                    filed:'d',
                                },
                                {
                                    id:5,
                                    lebel:'课程内容的各专题安排顺序符合学院的思维逻辑和学习习惯程度。',
                                    score:10,
                                    filed:'e',
                                },
                            ],
                        },
                        {
                            id:10015,
                            lebel:'课程结构',
                            option:[
                                {
                                    id:6,
                                    lebel:'核心课程重点突出。',
                                    score:10,
                                    filed:'f',
                                },
                                {
                                    id:7,
                                    lebel:'现场教学、研讨交流、视频教学安排合理。',
                                    score:10,
                                    filed:'g',
                                },
                            ],
                        },
                        {
                            id:10017,
                            lebel:'课程效果',
                            option:[
                                {
                                    id:8,
                                    lebel:'培训课程对更新、扩充学员专业知识结构的针对性。',
                                    score:10,
                                    filed:'h',
                                },
                                {
                                    id:9,
                                    lebel:'培训课程对提升学员工作履职能力的实用性。',
                                    score:10,
                                    filed:'i',
                                },
                                {
                                    id:10,
                                    lebel:'培训课程对拓宽学员视野、启发思维的新颖性。',
                                    score:10,
                                    filed:'j',
                                },
                            ],
                        },
                    ]
                    let arr = [].concat.apply([], JSON.parse(JSON.stringify(this.list)).map(item=>item.option))
                    this.$nextTick(()=>{
                        arr.map(item=>{
                            this.form[item.filed] = item.score
                        })
                    })
                    this.$forceUpdate()
                }
                this.score_all=100
            }
        },
       async commit(){
            let isYes = true
            await evaluationTeacherList({applyid:getapplyid()}).then(res=>{
                if(res.code==200&&res.data.list.length!=0){
                    isYes = res.data.list.filter(item =>item.teacher==this.value).length == 0
                }else{
                    isYes = true
                }
            })
            if (!isYes) {
                return this.$toast.fail('您已提交过评价,不能再次提交.')
            }
            let a = JSON.parse(JSON.stringify(this.form))
            let arr = JSON.parse(JSON.stringify(this.list)).map(item=>{
                if(this.score_all<90){
                    const num = Math.floor(Math.random()*(25-23)+23)
                    a[item.filed] = num
                }
                return {
                    id:item.id,
                    score:a[item.filed]
                }
            })
            let form = {
                applyid:getapplyid(),
                teacher:this.value,
                teacher_score:JSON.stringify(arr),
            }
            // return 
            this.loading=true
            evaluationTeacherLog(form).then(res=>{
                this.loading=false
                if(res.code==200){
                    this.$toast.success(res.msg)
                }else{
                    this.$toast.fail(res.msg)
                }
            })
        },
       async commitA(){
            let isYes = true
            await evaluationLogList({applyid:getapplyid()}).then(res=>{
                if(res.code==200&&res.data.list.length==0){
                    isYes=true
                }else{
                    isYes = false
                }
            })
            if (!isYes) {
                return this.$toast.fail('您已提交过评价,不能再次提交.')
            }
            let a = JSON.parse(JSON.stringify(this.form))
            let arr = [].concat.apply([], JSON.parse(JSON.stringify(this.list)).map(item=>item.option)).map(item=>{
                if(this.score_all<90){
                    const num = Math.floor(Math.random()*(10-9)+9)
                    a[item.filed] = num
                }
                return {
                    id:item.id,
                    score:a[item.filed]
                }
            })
            let form = {
                applyid:getapplyid(),
                course_score:JSON.stringify(arr),
            }
            this.loading=true
            evaluationLog(form).then(res=>{
                this.loading=false
                if(res.code==200){
                    this.$toast.success(res.msg)
                }else{
                    this.$toast.fail(res.msg)
                }
            })
        },
        changeFen(filed,data){
            // console.log(this.form,data,'6677878');
            // this.form[filed] = data
            this.$forceUpdate();
        }
    }
}
</script>

<style lang="scss" scoped>
p{
    margin: 0;
}
.video_title {
  display: flex;
  align-items: center;
  padding: 0 12px;
  background: #327bff;
  color: #fff;
  height: 2.75rem;
   
  p {
    margin: 0;
    width: calc(100vw - 64px);
    display: flex;
    justify-content: center;
  }
  .icon {
    font-size: 1.25rem;
  }
}
.item{
    display: flex;align-items: center;justify-content: space-between;padding: 12px 24px;
    p{
        flex: 2;
        text-align: center;
    }
    div{
        flex: 1;
        text-align: center; 
    }
}
.border{
    border-bottom: 1px solid #ccc;
}
</style>